{% extends "templates/base.phtml" %}
{% block content %}
<div class="page-content-wrap">
    <div class="row">
        <div class="col-md-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h3 class="panel-title">应用详情</h3>
                        <div class="btn-group pull-right">
                            <a class="btn btn-success" href="/admin/app/myapp/"><i class="fa fa-plus"></i>我的应用</a>
                        </div>
                    </div>
                    <div class="panel-body">
                        <div class="row">
                            <div class="form-horizontal col-md-12 app-buy-wrap">
                                <div class="app-wrap col-md-10">
                                    <div class="col-md-12 app">
                                        <div class="col-md-2 col-sm-2 app-img">
                                            <img src="{{app.pic}}"/>
                                        </div>
                                        <div class="col-md-10 app-info">
                                            <div class="app-name">
                                                <h3>{{app.appname}}</h3>
                                                <p><strong>&nbsp;&nbsp;&nbsp;&nbsp;{{app.versions}}</strong></p>
                                            </div>
<!--                                            <div class="app-version">-->
<!--                                                <p><strong>{{app.versions}}&nbsp;&nbsp;&nbsp;&nbsp;</strong><strong>{{app.registertime}}</strong></p>-->
<!--                                            </div>-->
                                        </div>
                                    </div>
                                    <div class="col-md-12 app-intro">
                                        <p>&nbsp;&nbsp;&nbsp;应用简介：{{app.intro}}</p>
                                    </div>
                                </div>
                                <div class="buy-wrap col-md-2">
                                    <div class="price col-md-12"><h4>价格：{{app.price}}</h4></div>
                                    <div class="buy col-md-12"><button class="btn btn-info" onclick="buyConfirm({{ app.id }});">购买</button></div>
                                </div>
                            </div>
                            <div class="form-horizontal col-md-12 app-comment-wrap">
                                <div class="panel panel-default tabs">
                                    <ul class="nav nav-tabs" role="tablist">
                                        <li class="active"><a href="#tab-first" role="tab" data-toggle="tab" aria-expanded="true">应用详情</a></li>
<!--                                        <li class=""><a href="#tab-second" role="tab" data-toggle="tab" aria-expanded="false">评论详情</a></li>-->
                                    </ul>
                                    <div class="panel-body tab-content">
                                        <div class="tab-pane active app-detail" id="tab-first">
                                            <div class="form-group col-md-12">
                                                <div class="detail-wrap col-md-12">
                                                    <p>{{app.details}}</p>
                                                </div>
                                            </div>
                                        </div>
<!--                                        <div class="tab-pane comment-detail" id="tab-second">-->
<!--                                            <div class="form-group col-md-12">-->
<!--                                                <p>{{app.details}}</p>-->
<!--                                                <div class="comment-wrap"></div>-->
<!--                                            </div>-->
<!---->
<!--                                        </div>-->
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
        </div>
    </div>
</div>
{%endblock%}
{%block end%}
<style type="text/css">
    .app-buy-wrap{
        margin-bottom: 20px;
    }
    .app-name *{
        display: inline;
    }
    .app-info{
        padding-top: 30px;
    }
    .app-img{
        overflow: hidden;
        max-height: 150px;
    }
    .app-img img{
        width: 100%;
        height: auto;
    }
    .app-intro{
        margin-top: 5px;
    }
    .buy-wrap{
        padding-top: 30px;
    }
    .buy-wrap h4{
        color:#3FBAE4;
    }
    .price,.buy,{
        text-align:center;
    }
    .detail-wrap{
        text-align:center;

    }
    .detail-wrap img{
        margin-bottom: 10px;
        width: 100%;
        height: auto;
    }
</style>
<script type="text/javascript">
    function buyConfirm(buy_id) {
        noty({
            text: '确定要购买此应用么?',
            layout: 'topRight',
            buttons: [
                {
                    addClass: 'btn btn-success btn-clean',
                    text: '确定',
                    onClick: function ($noty) {
                        $noty.close();
                        $.post('/admin/app/buy/' + buy_id, {}, function (result) {
                            console.log(result);

                            //noty({text: '购买成功', layout: 'topRight', type: 'success'});
                            //location.reload();
                            //TODO
                            if (result.status == "success") {
                                noty({text: '购买成功', layout: 'topRight', type: 'success'});
                                setTimeout(function(){
                                    location.reload();
                                },1000);

                            }
                            else if (result.status == "yjgm") {
                                noty({text: '已经购买，请在应用到期后购买', layout: 'topRight', type: 'error'});
                                setTimeout(function(){
                                    location.reload();
                                },1000);
                            }
                            else if (result.status == "jfbg") {
                                noty({text: '积分不够，请充值', layout: 'topRight', type: 'error'});
                                setTimeout(function(){
                                    location.reload();
                                },1000);
                            }
                            else {
                                noty({text: '购买失败', layout: 'topRight', type: 'error'});
                                setTimeout(function(){
                                    location.reload();
                                },1000);
                            }
                        }, 'json');
                    }
                },
                {
                    addClass: 'btn btn-danger btn-clean',
                    text: '取消', onClick: function ($noty) {
                        $noty.close();
                    }
                }
            ]
        })
    }
</script>
{%endblock%}